<template>
	<view class="countwrap">
		<block v-if="datah != '00'">
			<text class="box" :style="{backgroundColor: bgColor,color:Color}">{{datah}}</text>
			<text class="tag" :style="{color:dotColor}" >:</text>
		</block>
    <text class="box" :style="{backgroundColor: bgColor,color:Color}">{{datam}}</text>
    <text class="tag" :style="{color:dotColor}" >:</text>
    <text class="box" :style="{backgroundColor: bgColor,color:Color}">{{datas}}</text>
	</view>
</template>

<script>
	const times = ['00','02','04','06','08','10','12','14','16','18','20','22','24'];
	export default {
		name: 'benCountdown',
    props: {
      bgColor: {
        type: String,
        default: ''
      },
		Color:{
        type: String,
        default: '#333'
      },
	  dotColor:{
        type: String,
        default: '#000000'
      },
	  timeDifference:{
		type: [Number, String],
		default:0 
	  },
	  index:{
		type: Number,
		default:0   
	  },
	  item:{
		type:Object,
		default() {
			return {}
		}
         }
	},
		data() {
			return {
				timer: null,
				datah: '00',
				datam: '00',
				datas: '00',
				leftTime: '00',
				seconds: 0,
				test: 7,
			};
		},
		created() {
			clearInterval(this.timer);
			this.geiCountDown();
		},
		beforeDestroy() {
			clearInterval(this.timer);
		},
		methods: {
			geiCountDown(){
				console.log(this.timeDifference)
				var that =this
				var pause = setInterval(function () {
				var nowdate = new Date().getTime()   //获取当前时间毫秒数
				let date = new Date(that.timeDifference).getTime();
				var enddate = date;   //后台传来的倒计时数据
				var totaltime =enddate-nowdate  //获取时间差
				 that.countDown =that.totaltime(totaltime)
				 // 时间到了  就让暂停吧
				 if( that.countDown=='00'){
					 clearInterval(pause)
					 that.$emit('Timeisup',that.item,that.index)
				 }
				}, 1000)
				
			},
			totaltime(a){   //计算单个剩余时间
			  let totaltime = a
			    let that = this
			      var h, m, s, d
			      function test(num) {
			          if (num < 10) {
			              num = "0" + num    
			          }
			          return num
			      }
			    if (totaltime > 0) {
			        d = Math.floor(totaltime / 1000 / 60 / 60 / 24) * 24
			        h = Math.floor(totaltime / 1000 / 60 / 60 % 24)
			        m = Math.floor(totaltime / 1000 / 60 % 60)
			        s = Math.floor(totaltime / 1000 % 60)
			        //获取时分秒
			        h = d + h
			        h = test(h)
			        m = test(m)
			        s = test(s)
					
					this.datah =h
					this.datam = m
					this.datas = s
			    } else {
			      return '00'
			    }
			},
			
			
		
		}
	}
</script>

<style lang="scss" scoped>
	.countwrap{
		display: flex;
		.box{
      display: inline-block;
      // width: 35rpx;
      height: 35rpx;
      border-radius: 6rpx;
      line-height: 35rpx;
      text-align: center;
      font-size: 24rpx;
	  font-weight: 500;
    }
    .tag{
      line-height: 35rpx;
      padding: 0 4rpx;
    }
	}
</style>
